:root {
  --syntax_normal: #1b1e23;
  --syntax_comment: #a9b0bc;
  --syntax_number: #20a5ba;
  --syntax_keyword: #c30771;
  --syntax_atom: #10a778;
  --syntax_string: #008ec4;
  --syntax_error: #ffbedc;
  --syntax_unknown_variable: #838383;
  --syntax_known_variable: #005f87;
  --syntax_matchbracket: #20bbfc;
  --syntax_key: #6636b4;
  --mono_fonts: 82%/1.5 Menlo, Consolas, monospace;
}
.observablehq--collapsed,
.observablehq--expanded,
.observablehq--function,
.observablehq--gray,
.observablehq--import,
.observablehq--string:after,
.observablehq--string:before {
  color: var(--syntax_normal);
}
.observablehq--collapsed,
.observablehq--inspect a {
  cursor: pointer;
}
.observablehq--field {
  text-indent: -1em;
  margin-left: 1em;
}
.observablehq--empty {
  color: var(--syntax_comment);
}
.observablehq--blue,
.observablehq--keyword {
  color: #3182bd;
}
.observablehq--forbidden,
.observablehq--pink {
  color: #e377c2;
}
.observablehq--orange {
  color: #e6550d;
}
.observablehq--boolean,
.observablehq--null,
.observablehq--undefined {
  color: var(--syntax_atom);
}
.observablehq--bigint,
.observablehq--date,
.observablehq--green,
.observablehq--number,
.observablehq--regexp,
.observablehq--symbol {
  color: var(--syntax_number);
}
.observablehq--index,
.observablehq--key {
  color: var(--syntax_key);
}
.observablehq--prototype-key {
  color: #aaa;
}
.observablehq--empty {
  font-style: oblique;
}
.observablehq--purple,
.observablehq--string {
  color: var(--syntax_string);
}
.observablehq--error,
.observablehq--red {
  color: #e7040f;
}
.observablehq--inspect {
  font: var(--mono_fonts);
  /* overflow-x: auto; */
  display: none;
  white-space: pre;
}
.observablehq--error .observablehq--inspect {
  word-break: break-all;
  white-space: pre-wrap;
}
h1 {
  font-size: 21px;
  color: #c80e45;
  margin-bottom: 0px;
  transform: translate(0px, -20px);
}
h2 {
  font-size: 21px;
  color: #000;
  margin-bottom: 0px;
  transform: translate(0px, -20px);
}
.pie-text {
  font-size: 15px;

  /* transform: translate(480px, 225px); */
}
.legend-pie {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-direction: column;
  padding: 10px 0;
  position: absolute;
  /* bottom: 20px;
  left: 400px; */
  font-size: 12px;
  transform: translate(0px, 0px); /*图例位置*/
}
.legend-pie span {
  /*图例小方块大小*/
  width: 10px;
  height: 10px;
  margin-right: 10px;
}

.legend-pie span.color1 {
  background-color: #feceb7;
}

.legend-pie span.color2 {
  background-color: #fd9d70;
}

.legend-pie span.color3 {
  background-color: #fb6b28;
}
.legend-pie span.color4 {
  background-color: #b11818;
}
#pie {
  /* transform: translate(810px, -200px); */
  display: inline-block;
  width: 500px;
}
